import React from "react";
import { connect } from "dva";
import { routerRedux } from "dva/router";
import { WhiteSpace, Tabs } from "antd-mobile";
// import banner from '../../../../assets/work/banner2.jpg';
import ListUnit from './relationUnit';

class Relationlist extends React.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }

  changeTabsActive = (tab) => {
    this.props.dispatch({
      type: 'relationList/changeTabsActive',
      payload: {
        key: tab,
      },
    });
  }

  // 详情
  toParticulars = ({ id }, rowID, e) => {
    if (e) e.preventDefault();
    this.props.dispatch(
      routerRedux.push({
        pathname: "/work/relation/tparticulars",
        query: {
          id,
        },
      })
    );
  };

  updateList = ({ page, limit }) => {
    const { tabActive } = this.props.relationList;
    const { org_code: orgCode } = this.props.user.current_org;
    this.props.dispatch({
      type: 'relationList/fetchList',
      payload: {
        page,
        limit,
        tabActive,
        orgCode,
      }
    });
  }

  render() {
    /*
      const examineList = [
        {
          banner,
          name: '李春燕',
          identity: '中共党员',
          source: '区县内转出',
          date: '2017-11-13 15:55',
          from: '重庆市机场集团第一党支部',
          to: '重庆市机场集团第二党支部',
        },
      ];
      const doneList = [
        {
          banner,
          name: '李春燕',
          identity: '中共党员',
          source: '区县内转出',
          date: '2017-11-13 15:55',
          from: '重庆市机场集团第一党支部',
          to: '重庆市机场集团第二党支部',
        },
      ];
    */
    const { tabActive, examine, done } = this.props.relationList;
    const {
      page: ePage,
      limit: eLimit,
      list: eList,
    } = examine;
    const {
      page: dPage,
      limit: dLimit,
      list: dList,
    } = done;
    return (
      <div>
        <WhiteSpace />
        <Tabs defaultActiveKey={tabActive} animated={false} onChange={this.changeTabsActive}>
          <Tabs.TabPane tab="待审核" key="1">
            <WhiteSpace size="lg" />
            <ListUnit
              page={ePage}
              limit={eLimit}
              list={eList}
              onRowClick={this.toParticulars}
              onRefresh={this.updateList}
              onEndReached={this.updateList}
            />
          </Tabs.TabPane>
          <Tabs.TabPane tab="已转接" key="2">
            <WhiteSpace size="lg" />
            <ListUnit
              page={dPage}
              limit={dLimit}
              list={dList}
              onRefresh={this.updateList}
              onEndReached={this.updateList}
            />
          </Tabs.TabPane>
        </Tabs>
      </div>
    );
  }
}

function mapStateToProps({ relationList, user }) {
  return { relationList, user };
}
export default connect(mapStateToProps)(Relationlist);
